<!DOCTYPE html>
<html lang="zh-cn">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no" />
<meta name="renderer" content="webkit">
<title></title>
<link rel="stylesheet" href="css/pintuer.css">
<link rel="stylesheet" href="css/admin.css">
<script src="js/jquery.js"></script>
<script src="js/pintuer.js"></script>
<script src="js/vue.min.js" type="text/javascript" charset="utf-8"></script>
<script src="js/server.js" type="text/javascript" charset="utf-8"></script>
</head>
<body>
<div class="panel admin-panel" id="app">
  <div class="panel-head"><strong><span class="icon-pencil-square-o"></span> 文章详情</strong></div>
  <div class="body-content">
    <form method="post" class="form-x" action="">      
      <div class="form-group">
        <div class="label">
          <label>标题：</label>
        </div>
        <div class="field">
        
          <div class="tips" >{{article.title}}</div>
        </div>
      </div>
           <div class="form-group">
        <div class="label">
          <label>图片：</label>
        </div>
        <div class="field">
        	<img v-bind:src="web_static_server+article.image" />
         
        </div>
      </div>
  
      <div class="form-group" >
        <div class="label">
          <label>内容：</label>
        </div>
        <div class="field">
         
          <div class="tips" name="content">
          	{{article.content}}
          </div>
        </div>
      </div>
   
    </form>
  </div>
</div>
</body>


<script type="text/javascript">
	//获取ULR参数的函数
	function getUrlParam (name) {
     var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)");
     var r = window.location.search.substr(1).match(reg);
     if (r!= null) {
        return unescape(r[2]);
     }else{
        return null;
     }
	}    

	
	
	var _id=getUrlParam("id");
	
	//Hint表示提示对象 ，把提示信息封装到hint对象中
	var vue = new Vue({
		el : '#app',
		data : {
			article:{},
			web_server:window.web_server,
			web_static_server:this.web_server+"/static/"
		},
		methods : {
			init : function() {
				var _self = this;
				//自定义 一个函数 ，用来查询所有的商品信息，返回Json
				$.get(_self.web_server+"/article/select", {id:_id} ,function(result) {
					if(result.code=="200"){
						_self.article = result.data;
					}
				
				}, "json");
			}

		}

	});
	//初始化Vue对象完毕之后，就调用init方法 （一进入页面，就显示数据）
	vue.init();
</script>



</html>